<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../js/cookie.js"></script>
    <style>
        .createCode {
            user-select: none;
        }

        .right {
            font-size: 12px;
            color: green;
        }

        .error {
            font-size: 12px;
            color: red;
        }
    </style>
</head>

<body>
    <div class="form">
        <div class="input-group">
            <lable>账&emsp;号:</lable>
            <input type="text" class="account">
            <span class="account_tips"></span>
        </div>
        <div class="input-group">
            <lable>密&emsp;码:</lable>
            <input type="text" class="pwd">
            <span class="pwd_tips"></span>
        </div>
        <div class="input-group">
            <input type="submit" class="btn" value="登录">
        </div>
    </div>
</body>

<script>

    var accountInp = document.getElementsByClassName("account")[0];
    var accountTips = document.getElementsByClassName("account_tips")[0];

    var pwdInp = document.getElementsByClassName("pwd")[0];
    var pwdTips = document.getElementsByClassName("pwd_tips")[0];


    var btn = document.getElementsByClassName("btn")[0];


    // 点击注册按钮 => 如果全都校验成功,就跳转页面
    btn.onclick = function () {
        var account = accountInp.value;
        var pwd = pwdInp.value;

        if (account && pwd) { // 都有值
            var xhr = new XMLHttpRequest();

            xhr.open("post","http://121.43.116.41/demo/php/login_account.php",true);

            xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
            xhr.send(`account=${account}&pwd=${pwd}`);

            xhr.onreadystatechange = function(){
                if(xhr.readyState == 4 && xhr.status == 200){
                    var result = xhr.responseText;

                    result = JSON.parse(result);
                    console.log(result);

                    var {status,message,user} = result;

                    if(status){
                        setCookie("lgc","a123123",7 * 24 * 60 * 60);
                        location.href = "./index.html";
                    }else{
                        alert(message);
                    }

                }
            }
        }

    }



</script>

</html>